<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<input type="file" name="" id="fileId" />
		<img src=""/>

		<script>
			/*
			// 简单读取字符串
			var blob = new Blob(['helloworld'], {
				type: 'text/plain'
			})
			// console.log(blob)
			let blob2 = blob.slice(0, 5, 'text/plain')
			let filereader = new FileReader()
			filereader.readAsText(blob2)
			// filereader是异步的,直接读不到
			// let res = filereader.result
			filereader.onload = function(e) {
				console.log(e.target.result)
			} */
			
			

			/* 	
			//简单读取文件
			let fileObj = document.getElementById('fileId')
				fileObj.onchange = function(e){
					console.log(e.target.files)
				}
				 */
				
			let fileObj = document.getElementById('fileId')
			fileObj.onchange = function(e){
				console.log(e.target.files)
				let reader = new FileReader()
				console.log('reader',reader)
				// readAsDataURL读取FileReader实例的 base64格式
				reader.readAsDataURL(e.target.files[0])
				reader.onload = function(e){
					console.log(e.target.result)
				}
			}
			
			
			
			
			
		</script>
	</body>
</html>
